<template style="	">
	<view class="Trial-class" style="background: #eee;height: 100vh;">
		<view class="Trial-item" @click="individualMember">
			<view>
				<image src="/static/images/vip2.png" class="img-hy" mode=""></image>
			</view>
			<view class="Trial-two " style="margin-left: -35rpx;">
				<view class="Trial-title animated-text" >
					个人会员
				</view>
				<view class="Trial-wz">可尽情创作、下载、浏览作品</view>
			</view>
			<view>
				<image src="/static/images/wangyou.png" mode="" class="wangyou" style="width: 20rpx;height: 35rpx;"></image>
			</view>
		</view>
		<view class="Trial-item" @click="merchantMember">
			<view>
				<image src="/static/images/sjtp.png" class="img-hy" mode=""></image>
			</view>
			<view class="Trial-two" style="margin-left: -100rpx;">
				<view class="Trial-title animated-text">
					商家会员
				</view>
				<view class="Trial-wz">可独享“脉新人”板块功能</view>
			</view>
			<view>
				<image src="/static/images/wangyou.png" class="wangyou" mode="" style="width: 20rpx;height: 35rpx ;"></image>
			</view>
		</view>
		<view class="Trial-sb">
			<image src="/static/images/logo.png" class="sb" mode=""></image>
		</view>
	</view>
</template>

<script setup lang="ts">
	import { onMounted, reactive, ref, watch } from 'vue';
	import { baseURL } from '@/utils/config.ts';
	import { getWindowHeight } from '@/pages/util/getHeight';
	import { onLoad, onReachBottom, onShow, onHide, onPageScroll } from '@dcloudio/uni-app';

	import { get, post } from '@/utils/request';

	// console.log('useLoginuseLogin',useLogin);
	/** @name 数据 */
	const dataInfo = reactive({


	});
	

	const individualMember = async () => {
		try {

			uni.navigateTo({
				url: `/pages/mine/openVip`, // 目标页面路径（需在pages.json注册）
				success: () => console.log('跳转成功'),
				fail: (err) => console.error('跳转失败', err)
			})

		} catch (error) {
			console.error(error);
		}
	}


	const merchantMember = async (item : { isMember : any; imgUrl : any; }) => {
		try {
			uni.navigateTo({
				url: `/pages/mine/merchantAuthority`,
				success: () => console.log('跳转成功'),
				fail: (err) => console.error('跳转失败', err)
			})
		} catch (error) {
			console.error(error);
		}
	}



	// 试用
	const Trial = async (item : { isMember : any; imgUrl : any; }) => {
		// 推荐
		console.log("============")
		try {
			if (item.isMember == '1') {
				uni.navigateTo({
					url: `/pages/homepage/rehandling?tab=1&current=1&id=` + item.id, // 目标页面路径（需在pages.json注册）
					success: () => console.log('跳转成功'),
					fail: (err) => console.error('跳转失败', err)
				})

			} else {
				uni.navigateTo({
					url: `/pages/subscribeMember/index`, // 目标页面路径（需在pages.json注册）
					success: () => console.log('跳转成功'),
					fail: (err) => console.error('跳转失败', err)
				})
				console.log("成为商家")
			}

		} catch (error) {
			console.error(error);
		}
	}
</script>


<style scoped>
	.Trial-class {
		padding-top: 50rpx;
		/* 	width: 690rpx;
		margin: 20rpx auto;
		height: 200rpx; */


	}

	.Trial-item {
		width: 702.02rpx;
		height: 238.96rpx;
		background: #ffffff;
		margin: 0rpx auto 50rpx;
		box-sizing: border-box;
		border-radius: 27rpx;
		display: flex;
		align-items: center;
		padding: 0rpx 20rpx;
		justify-content: space-between;
	}

	.img-hy {
		width: 120rpx;
		height: 120rpx;
	}

	.Trial-wz {
		color: #909399;
		margin-top: 15rpx;
	}

	.Trial-sb {
		text-align: center;
		margin-top: 200rpx;
		box-sizing: border-box;
	}

	.sb {
		width: 173rpx;
		height: 148rpx;
	}
	.wangyou{
		width: 25rpx;
		height: 69rpx;
	}
	.Trial-title{
		
	}
	 .animated-text {
	      font-size: clamp(1rem, 6vw, 5rem);
	      font-weight: bold;
	      margin: 0;
	      
	      /* 渐变背景 */
	      background: linear-gradient(to top,rgb(255,1,82),rgb(255,165,13),rgb(255,1,82));
	      background-size: 100% 200%;
	      background-position: 0 100%;
	      
	      /* 将渐变应用到文字 */
	      -webkit-background-clip: text;
	      background-clip: text;
	      -webkit-text-fill-color: transparent;
	      
	      /* 动画效果 */
	      animation: colorChange 3s ease-in-out infinite alternate;
	    }
</style>